{extend name="layouts/main" /}
{block name="link"}{/block}
{block name="css"}
<style>
	.ibox {
		clear: both;
		margin-bottom: 25px;
		margin-top: 0;
		padding: 0;
	}
	.ibox-title {
		background-color: #ffffff;
		border-color: #e7eaec;
		border-image: none;
		border-style: solid solid none;
		border-width: 4px 0px 0;
		color: inherit;
		margin-bottom: 0;
		padding: 14px 15px 7px;
		min-height: 48px;
	}
	.ibox-content {
		background-color: #ffffff;
		color: inherit;
		padding: 15px 20px 20px 20px;
		border-color: #e7eaec;
		border-image: none;
		border-style: solid solid none;
		border-width: 1px 0px;
	}
	.float-e-margins .btn {
		margin-bottom: 5px;
	}
	.btn-info {
		background-color: #23c6c8;
		border-color: #23c6c8;
		color: #FFFFFF;
	}
	.btn-org {
		color: #fff;
		background-color: #F39800;
		border-color: #F39800;
	}
	.btn {
		border-radius: 3px;
	}
	.btn {
		display: inline-block;
		padding: 6px 12px;
		font-size: 14px;
		font-weight: 400;
		line-height: 1.42857143;
		text-align: center;
		white-space: nowrap;
		vertical-align: middle;
		cursor: pointer;
		user-select: none;
		background-image: none;
		border: 1px solid transparent;
	}
	a {
		text-decoration: none;
	}
	.form-control, .single-line {
		background-color: #FFFFFF;
		background-image: none;
		border: 1px solid #e5e6e7;
		border-radius: 1px;
		color: inherit;
		/* display: block; */
		padding: 6px 12px;
		transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
		width: 100%;
		font-size: 14px;
	}
	.input-group {
		position: relative;
		display: table;
		border-collapse: separate;
		float: left;
		margin-bottom: 5px;
	}
	.panel-heading {
		padding: 0px 10px 0px 15px;
		border-bottom: 1px solid transparent;
		border-top-left-radius: 3px;
		border-top-right-radius: 3px;
	}
	.panel-body {
		padding: 0px 15px 15px 15px;
	}
	.input-group-addon {
		background-color: #fff;
		border: 1px solid #E5E6E7;
		color: inherit;
		font-size: 14px;
		font-weight: 400;
		line-height: 1;
		padding: 6px 12px;
		text-align: center;
		width: 1%;
	}
	.text-danger {
		color: #ed5565;
	}
	/* .table {
		width: 100%;
		max-width: 100%;
		margin-bottom: 20px;
	}
	table {
		background-color: transparent;
	}
	table {
		border-spacing: 0;
		border-collapse: collapse;
	}
	table {
		display: table;
		border-collapse: separate;
		border-spacing: 2px;
		border-color: grey;
	}
	thead {
		display: table-header-group;
		vertical-align: middle;
		border-color: inherit;
	}
	tr {
		display: table-row;
		vertical-align: inherit;
		border-color: inherit;
	}
	table,table tr th, table tr td { border:1px solid #DCDCDC; }
	table { width: 200px; min-height: 25px; line-height: 25px; text-align: center; border-collapse: collapse;} */
	.zengyan{width: 267px;}
	.layui-layout-admin .layui-body {
	    top: 0px;
	}
	.layui-body {
	    left: 0px;
	}
</style>
{/block}
{block name="content"}
<div class="layui-tab layui-tab-brief" lay-filter="demoTitle">
	<div class="layui-body layui-tab-content site-demo site-demo-body">
		<div class="layui-tab-item layui-show">
			<div class="layui-main">
				<div id="LAY_preview">
					<div class="layui-fluid" style="position: relative;margin: 0 auto;padding: 0 0px;">
						<div class="layui-card" style="overflow-y: hidden;">
							<div class="layui-tab layui-tab-card">
								<ul class="layui-tab-title">
									<li><a href="{:url('source',array('stime'=>$stime,'etime'=>$etime,'status'=>$status))}">访问页面</a></li>
									<li><a href="{:url('ante_page',array('stime'=>$stime,'etime'=>$etime,'status'=>$status))}">来路分析</a></li>
									<li class="layui-this"><a href="{:url('details',array('stime'=>$stime,'etime'=>$etime,'status'=>$status))}">访问明细</a></li>
								</ul>
								<div class="layui-tab-content" style="height: 100%;">
									<div class="layui-tab-item layui-show">
										<div class="panel-body">
											<section class="panel">
												<header class="panel-heading" style='line-height: 30px;'>
													<font class='text-info'>{$title['t1']}</font>
													<div class="search_titw60">
														<div class="input-group search-form">
															<div style='float: left; margin-right: 5px;'>
																<a href="{$dataurl['time1']}"
																class='btn btn-info {if condition="$status eq 1"}btn-org{/if}'>今天</a>
																<a href="{$dataurl['timezt']}"
																class='btn btn-info {if condition="$status eq 2"}btn-org{/if}'>昨天</a>
																<a href="{$dataurl['time7']}"
																class='btn btn-info {if condition="$status eq 3"}btn-org{/if}'>最近七天</a>
																<a href="{$dataurl['time30']}"
																class='btn btn-info {if condition="$status eq 4"}btn-org{/if}'>最近30天</a>
																<a href="{$dataurl['timed']}"
																class='btn btn-info {if condition="$status eq 5"}btn-org{/if}'>本月</a>
															</div>
															<div class="input-group input-large custom-date-range" data-date="" data-date-format="">
																<input name="stime" value="{$stime|default=''}" placeholder="开始日期" class="zengyan form-control layer-date" id="date1">
																<span class="input-group-addon">To</span>
																<input name="etime" value="{$etime|default=''}" placeholder="结束日期" class="zengyan form-control layer-date" id="date2">
																<span class="input-group-btn">
																	<a class="btn btn-default"type="button" id="search" url="{:url('details',array('tab'=>1))}">
																		<i class="fa fa-search"></i>
																	</a>
																</span>
															</div>
														</div>
													</div>
													<div class='clear'></div>
												</header>
												<div class="panel-body">
													<table class="table table-bordered layui-table">
														{if condition="$vdata"}
														{volist name="vdata" key='k' id="info"}
														<thead class="panel-heading dark">
															<tr>
																<th width="10%">时间</th>
																<td width="50%">{$info['acctime']|time_format}</td>
																<th width="10%">IP</th>
																<td width="30%">{$info['ip']}</td>
															</tr>
														</thead>
														<tr>
															<th width="10%">地区-网络</th>
															<td width="50%">{$info['address']}-{$info['ismobile']}</td>
															<th width="10%">浏览器</th>
															<td width="30%">{$info['browser']}</td>
														</tr>
														<tr>
															<th  width="10%">来路页面</th>
															<td  width="90%" colspan="3" style="word-break:break-all"><?php echo $info['antepage'];?></td> 
														</tr>
														<tr>
															<th  width="10%">受访页面</th>
															<td  width="90%" colspan="3" style="word-break:break-all"><?php echo $info['visitpage'];?></td>
														</tr>
														{/volist}
														<tr>
															<td colspan="4" class="text-center">
																<div class="dataTables_paginate paging_bootstrap pagination page p0 m0">
																	<!-- 分页 -->
																</div>
															</td>
														</tr>
														{else/}
														<tr>
															<td colspan="4" class="text-center">aOh! 暂时还没有内容!</td>
														</tr>
														{/if}
													</tbody>
												</table>

												<table class="table table-striped text-info" style="display:none;">
													<thead>
														<tr>
															<th>排名</th>
															<th>关键词</th>
															<th>搜索次数</th>
															<th>独立访客</th>
															<th>IP</th>
															<th>人均浏览次数</th>
														</tr>
													</thead>
													<tbody class='text-info'>
														{if condition="$vdata"}
														{volist name="vdata" key='k' id="info"}
														<tr>
															<td>{$pk+$k}</td>
															<td>{$info['id']}</td>
															<td>{$info['ip']}</td>
															<td>{$info['acctime']}</td>
															<td>{$info['cateid']}</td>
															<td>{$info['artid']}</td>
														</tr>
														{/volist}
														<tr>
															<td colspan="6" class="text-center">
																<div class="dataTables_paginate paging_bootstrap pagination page p0 m0">
																	<!-- 分页 -->
																</div>
															</td>
														</tr>
														{else/}
														<tr>
															<td colspan="6" class="text-center">aOh! 暂时还没有内容!</td>
														</tr>
														{/if}
													</tbody>
												</table>
												<!-- 分页 -->
												{$vdata|raw}
											</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>
{/block}
{block name="js"}
<script type="text/javascript">
	layui.use(['form','laydate','jquery'], function(){
		var form = layui.form //表单
			,laydate = layui.laydate //日期
			,$ = layui.jquery;
		// 日期
		laydate.render({
			elem: '#date1'
			// ,type: 'datetime'
		});
		laydate.render({
			elem: '#date2'
			// ,type: 'datetime'
		});
	});
</script>
{/block}